* {
	margin: 0;
    padding: 0;
}

html{
	overflow-x: hidden;
}
img {
    margin: 0 3px -3px 0;
}

button:focus,
input
{
    outline: none;
}

body{
}

.box{
	width: 750px;
	height: 1334px;
	background:url(../images/home_light.png) no-repeat;
	background-size: 100% 100%;
	display: flex;
	justify-content: center;
	position: relative;
}

.box_middle{
	width: 88%;
	height: 1200px;
	margin-top: 60px;
	/*background-color: blue;*/
	display: flex;
	flex-direction: column;
	align-items: center;
}

.box_header{
	width: 100%;
	height: 286px;
    background: url(../images/home_slogan.png) no-repeat -15% 0%;
}

.main{
	width: 100%;
	height: 477px;
	background: url(../images/home_puzzle1.png) no-repeat;
	background-size:100% 100% ;
	margin-top: 50px;
	position: relative;
}

.mainB{
	width: 107%;
	height: 515px;
	background: url(../images/home_puzzle2.png) no-repeat;
	background-size:100% 100% ;
	margin-top: 30px;
}


.main_door{
	width: 91%;
    height: 87%;
    background: url(../images/home_shade2.png) no-repeat;
    background-size: 100% 100%;
    position: absolute;
    top: 6%;
    left: 4%;
}

.main_card{
    width: 93%;
    height: 88%;
    /* background: red; */
    list-style: none;
    position: absolute;
    top: 6%;
    left: 4%;
}

.main_card li{
	width: 49%;
    height: 49%;
    background: url(../images/home_shade1.png) no-repeat;
    background-size: 100% 100%;
    margin: 4px 1px 2px 3px;
    float: left;
}

.main_card p{
	width: 46px;
	height: 46px;
	background-color: #c53328;
	color: #f2c247;
	font-size: 20px;
	line-height: 2.2;
	text-align: center;
	border-radius: 50%;
}

.main_action{
	width: 90%;
	height: 100px;
	/*background: red;*/
	margin-top: 25px;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.main_action_share{
	width: 112px;
	height: 108px;
	background: url(../images/home_button1.png);
}

.main_action_rock{
    width: 280px;
    height: 85px;
    background: url(../images/home_button2.png) no-repeat;
    background-size: 100% 117%;
    font-size: 38px;
    font-weight: 500;
    color: #d63c26;
    text-align: center;
    line-height: 2.3;
    margin-top: -10px;
}

.main_article_packet{
	width: 104.2px;
	height: 90.1px;
	background: url(../images/home_red.png) no-repeat;
	background-size:100% 100%  ;
}


/*弹出的元素*/
/*蒙板*/
.cover{
	width: 750px;
	height: 1334px;
	background-color: rgba(0,0,0,0.7);
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	top: 0;
	left: 0;
	
}

.cover_rule{
	width: 568px;
	height: 1071px;
	background: url(../images/supernatant_pop_up7.png) no-repeat;
	background-size:100% 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.cover_rule h1{
	font-size: 44px;
	line-height: 2.56;
	color: #fac218;
	margin-top: 40px;
}

.cover_rule_ul{
	width: 70%;
	height: 590px;
	font-size: 30px;
	line-height: 1.47;
	color: #08e0e1;
}

.cover_rule_ul li{
	margin-bottom: 30px;
}

.cover_rule_annota{
	width: 74%;
	height: 118px;
	font-size: 30px;
	line-height: 1.47;
	color: #fac218;
}

.cover_rule_know{
	width: 349px;
	height: 85px;
	background: url(../images/supernatant_button2.png) no-repeat;
	background-size:100% 100% ;
	font-size: 30px;
	line-height: 2.6;
	letter-spacing: 1.2px;
	text-align: center;
	color:#000000;
	margin-top: 50px;
}

.box_rule{
	width: 97px;
	height: 46px;
	border-top-left-radius: 14.5px;
	border-bottom-left-radius: 14.5px;
	background-color: #5ed0d2;
	font-size: 24px;
	line-height: 2;
	text-align: center;
	color: #041b3d;
	opacity: 0.8;
	position: absolute;
	top:130px;
	right: 0;
}

/*带背景糖果的*/
.coverB{
	background:url(../images/supernatant_candy8.png) no-repeat 49px 83px,  
url(../images/supernatant_candy7.png) no-repeat 550px 178px,  
url(../images/supernatant_candy5.png) no-repeat 20px 255px,  
url(../images/supernatant_candy1.png) no-repeat 636px 655px,  
url(../images/supernatant_candy3.png) no-repeat 150px 1055px,  
url(../images/supernatant_candy6.png) no-repeat 400px 1065px;
	width: 750px;
    height: 1334px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 0;
    left: 0;
}

.cover_surprise{
	width: 568px;
	height: 712px;
	background: url(../images/supernatant_pop_up1.png) no-repeat;
	background-size:100% 100%;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.cover_surprise_card{
	width: 331px;
	height: 246px;
	margin-top: 70px;
}

.cover_surprise p, .cover_phone p{
	font-size: 44px;
	color: #f7c243;
	margin-top: 18px;
}

.cover_phone p{
	margin-top: 70px;
}

.cover_phone{
	width: 568px;
	height: 559px;
	background: url(../images/supernatant_pop_up2.png);
	background-size:100% 100% ;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.cover_phone_inp{
	width: 438px;
	height: 80px;
	border-radius: 40px;
	background-color: #0bc7ca;
	font-size: 30px;
	font-weight: 500;
	line-height: 1.09;
	margin-top: 50px;
	text-align: center ;
	color: #153b54;
	border: 0px;
}

.cover_phone_format{
	font-size: 25px;
	color: darkred;
}


.cover_hint{
	width: 568px;
	height: 689px;
	background: url(../images/supernatant_pop_up5.png) no-repeat;
	background-size:100% 100% ;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.cover_hint p{
	width: 468px;
	height: 383px;
	font-size: 44px;
	line-height: 1.55;
	color: #f7c243;
	margin-top: 15%;
}

.main_chance{
	width: 100%;
	height: 23px;
	font-size: 24px;
	letter-spacing: 1.2px;
	text-align: center;
	color: #f2c247;
	margin-top: 10px;
}




/*背景为空*/
.beijing{
	background: url()!important;
}

/*隐藏*/
.hide{
	visibility: hidden;
}

.none{
	display: none;
}






